<div class="page page-table" data-ng-controller="appInfoIndex">
    <section class="panel panel-default table-dynamic">
        <div class="panel-heading"><strong><span class="glyphicon glyphicon-th"></span>&nbsp;&nbsp;&nbsp;&nbsp;APP下载情况列表</strong></div>
        <div class="table-filters">
            <form>
                <div class="row">
                    <!--<div  class="col-sm-1"></div>-->
                    <div  class="col-sm-3">
                        <div class="input-group ui-datepicker" data-ng-controller="DatepickerDemoCtrl">
                            <span class="input-group-addon"><i class="fa fa-calendar"></i>&nbsp;&nbsp;开始</span>
                            <input type="text"
                                   id="start"
                                   class="form-control"
                                   datepicker-popup="yyyy-MM-dd"
                                   ng-model="dt"
                                   is-open="opened"
                                   datepicker-options="dateOptions"
                                   close-text="关闭">
                        </div>
                    </div>
                    <div id="endDiv" class="col-sm-3">
                        <div class="input-group ui-datepicker" data-ng-controller="DatepickerDemoCtrl">
                            <span class="input-group-addon"><i class="fa fa-calendar"></i>&nbsp;&nbsp;结束</span>
                            <input type="text"
                                   id="end"
                                   class="form-control"
                                   datepicker-popup="yyyy-MM-dd"
                                   ng-model="dt"
                                   is-open="opened"
                                   datepicker-options="dateOptions"
                                   close-text="关闭">
                        </div>
                    </div>
                    <div class="col-sm-1"><a class="btn btn-primary" data-ng-click="pageChange(1)">查询</a></div>
                </div>
            </form>
        </div>
        <footer class="table-footer">
            <div class="row">
                <div class="col-md-6 page-num-info">
                    <span>
                        显示  共{{pageSize}}页   {{total}}条
                        <span style="margin-left: 30px;color: red;font-size: 18px;">目前的下载量&nbsp;{{count}}</span>
                    </span>

                </div>
                <div class="col-md-6 text-right pagination-container">
                    <pagination class="pagination-sm"
                                page="pageNum"
                                total-items="pageSize"
                                max-size="5"
                                on-select-page="pageChange(page)"
                                items-per-page="numPerPage"
                                rotate="true"
                                boundary-links="true"></pagination>
                </div>
            </div>
        </footer>
        <table class="table table-bordered table-striped table-responsive">
            <thead>
                <tr>
                    <th style="width:140px;"><div class="th">
                        机型
                        <span class="glyphicon glyphicon-chevron-up"
                              data-ng-click=" order('phoneModel') "
                              data-ng-class="{active: row == 'phoneModel'}"></span>
                        <span class="glyphicon glyphicon-chevron-down"
                              data-ng-click=" order('-phoneModel') "
                              data-ng-class="{active: row == '-phoneModel'}"></span>
                    </div></th>
                    <th><div class="th">
                        系统版本
                        <span class="glyphicon glyphicon-chevron-up"
                              data-ng-click=" order('phoneVersion') "
                              data-ng-class="{active: row == 'phoneVersion'}"></span>
                        <span class="glyphicon glyphicon-chevron-down"
                              data-ng-click=" order('-phoneVersion') "
                              data-ng-class="{active: row == '-phoneVersion'}"></span>
                    </div></th>
                    <th><div class="th">
                        开始使用时间
                        <span class="glyphicon glyphicon-chevron-up"
                              data-ng-click=" order('time') "
                              data-ng-class="{active: row == 'time'}"></span>
                        <span class="glyphicon glyphicon-chevron-down"
                              data-ng-click=" order('-time') "
                              data-ng-class="{active: row == '-time'}"></span>
                    </div></th>
                </tr>
            </thead>
            <tbody>
                <tr data-ng-repeat="info in appInfo">
                    <td>{{info.phoneModel}}</td>
                    <td>{{info.phoneVersion}}</td>
                    <td>{{info.time | dataFormat}}</td>
                </tr>
            </tbody>
        </table>
    </section>
</div>
